<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <link rel="stylesheet" href="./index.css" />
    </head>
    <body>
        <div class="frame">
            <div class="card">
                <div class="header">
                    <div class="title big">Weekly report</div>
                    <div class="date small">16. Sept - 22. Sept</div>
                    <div class="type small">Revenue</div>
                    <div class="value big">￥ 1145.14</div>
                </div>
                <div class="parameter">
                    <span class="red">Views</span>
                    <span class="blue">Purchases</span>
                </div>
                <div class="statistic">
                    <div class="line l1"></div>
                    <div class="line l2"></div>
                    <div class="line l3"></div>
                    <div class="data red">
                        <svg>
                            <polyline
                                points="
                                    10,46
                                    50,12
                                    90,23
                                    130,11
                                    170,38
                                    210,48
                                    250,19
                                "
                            ></polyline>
                        </svg>
                        <div class="points">
                            <div class="point p1">
                                <div class="tooltip">458</div>
                            </div>
                            <div class="point p2">
                                <div class="tooltip">812</div>
                            </div>
                            <div class="point p3">
                                <div class="tooltip">746</div>
                            </div>
                            <div class="point p4">
                                <div class="tooltip">877</div>
                            </div>
                            <div class="point p5">
                                <div class="tooltip">517</div>
                            </div>
                            <div class="point p6">
                                <div class="tooltip">434</div>
                            </div>
                            <div class="point p7">
                                <div class="tooltip">458</div>
                            </div>
                        </div>
                    </div>
                    <div class="data blue">
                        <svg>
                            <polyline
                                points="
                                    10,61
                                    50,50
                                    90,65
                                    130,55
                                    170,61
                                    210,74
                                    250,64
                                "
                            ></polyline>
                        </svg>
                        <div class="points">
                            <div class="point p1">
                                <div class="tooltip">26</div>
                            </div>
                            <div class="point p2">
                                <div class="tooltip">41</div>
                            </div>
                            <div class="point p3">
                                <div class="tooltip">22</div>
                            </div>
                            <div class="point p4">
                                <div class="tooltip">36</div>
                            </div>
                            <div class="point p5">
                                <div class="tooltip">25</div>
                            </div>
                            <div class="point p6">
                                <div class="tooltip">13</div>
                            </div>
                            <div class="point p7">
                                <div class="tooltip">20</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="days">
                    <div class="day">Mon</div>
                    <div class="day">Tue</div>
                    <div class="day">Wed</div>
                    <div class="day">Thu</div>
                    <div class="day">Fri</div>
                    <div class="day">Sat</div>
                    <div class="day">Sun</div>
                </div>
            </div>
        </div>
    </body>
</html>
